$(document).ready(function() {

	//商标列表
	Product.BrandsList();
	//功能列表
	Product.FunctionList();
	//地区列表
	Product.ProductDispatch();

	//初始化页面
	//	Product.Ajax();
	Product.initPage();
	Product.Click_goods();

})
//商标列表
var v_brands = new Vue({
	el: '#product_brands',
	data: function() {
		return {
			brands_list: []
		}
	}
})

//商标列表
var v_area = new Vue({
	el: '#product_dispatch',
	data: function() {
		return {
			product_dispatch: []
		}
	}
})
//功能列表
var v_function = new Vue({
	el: '#product_function',
	data: function() {
		return {
			function_list: []
		}
	}
})
//商品列表
var v_goods_list = new Vue({
	el: '#product_list',
	data: function() {
		return {
			product_list: []
		}
	}
})
//vue分页
var v_pagination = new Vue({
	el: '#pagination',
	data: function() {
		return {
			total: 0
		};
	},
	methods: {
		handleCurrentChange: function(val) {
			console.log('val', val)
			var p_data = {
				page: val
			}
			//分页
			Product.Ajax(p_data);
		}
	}
});
var Product = {
	//接口地址
	url_api: 'http://www.ibabypet.com.cn/public/index.php/api/goods/pro_list/', //商品列表
	url_api2: 'http://www.ibabypet.com.cn/public/index.php/api/species/brand ', //商标
	url_api3: 'http://www.ibabypet.com.cn/public/index.php/api/attributes/attributes_list', //功能列表
	url_api4: 'http://www.ibabypet.com.cn/public/index.php/api/area/area_list', //配送地区列表
	//location.search属性返回url 查询部分（？后面的部分）
	search_str: location.search,
	//提交数据
	cort_id: 0,
	brand_id: 0,
	property_id: 0,
	num: 0, //传1表示显示有货产品
	area: 0, //区域id
	postage: 0, //传1表示包邮
	page: 1, //分页参数
	//初始化商品
	Ajax: function(p_data) {
		var that = this;
		$.ajax({
			type: "post",
			url: that.url_api,
			async: true,
			data: p_data,
			success: function(res) {
				res = JSON.parse(res);
				console.log('商品页面res', res)
				if(res.code == 200) {
					var data_arr = res.data.goods; //data_arr是arr
					v_goods_list.product_list = data_arr;
					v_pagination.total = data_arr.length; //共多少个商品数
					$('.js_all_product_num').text(data_arr.length);
				} else {
					var M = {}
					if(M.dialog){
						return M.dialog.show()
					}
					M.dialog = jqueryAlert({
						'content': res.msg,
						'closeTiem': 1500
					})
				}
			},
			error: function(res) {
				alert('ajax error')
			}
		});
	},
	//判断url有没有参数 穿不同参数渲染页面
	initPage: function() {
		var that = this;
		var url_parm = that.search_str;
		if(url_parm) {
			var url_parm = url_parm.split('?')[1];
			//category dog cat pet
			var category = url_parm.split('&')[0].split('=')[1];
			//property 1 是品牌 2 是功能
			var property = url_parm.split('&')[1].split('=')[1];
			var data_id = url_parm.split('&')[2].split('=')[1];
			var data_text = decodeURI(url_parm.split('&')[3].split('=')[1]);
			console.log('data_text', data_text)

			console.log('property', property)
			console.log('data_id', data_id)

			if(property == 1) {
				var p_data = {
					brand_id: data_id
				};
				that.Ajax(p_data);

			} else {
				var p_data = {
					property_id: data_id
				};
				that.Ajax(p_data);
			};
			//渲染面包屑导航
			var category_text = '';
			switch(category) {
				case 'dog':
					category_text = '狗狗专区'
					break;
				case 'cat':
					category_text = '猫咪专区'
					break;
				case 'pet':
					category_text = '小宠专区'
					break;
				default:
					break;
			};
			var product_nav_el;
			product_nav_el = '<a href="index.html">首页</a>><a href="#" belong="' + category + '">' + category_text + '</a>><a href="#">' + data_text + '</a>';
			$('.product_nav').prepend(product_nav_el);

		} else {
			that.Ajax();
			var product_nav_el;
			product_nav_el = '<a href="index.html">首页</a>><a href="product.html">所有商品</a>';
			$('.product_nav').prepend(product_nav_el);
		};
	},

	//brands 列表点击选中 
	BrandsList: function() {
		var that = this;
		//获取数据渲染页面
		$.ajax({
			type: "get",
			url: that.url_api2,
			async: true,
			success: function(res) {
				res = JSON.parse(res);
				console.log('商标的res', res)
				if(res.code == 200) {
					var data_arr = res.data;
					that.brand_data = data_arr;
					v_brands.brands_list = data_arr;
				} else if(res.cose == 1) {
					alert('暂无商品')
				} else {
					alert(res);
				}

			},
			error: function(res) {
				alert(res)
			}
		});
		//点击商标
		$(document).on('click', '.product_brand li', function() {

			$(this).toggleClass('selected');
			$(this).siblings().removeClass('selected');
			var li_el_arr = $('.product_brand li');
			var brand_id;
			var p_data = {};
			$.each(li_el_arr, function(i, v) {
				if($(v).hasClass('selected')) {
					brand_id = $(v).data('id');
				}
			});
			p_data = {
				brand_id: brand_id
			};
			if(brand_id) {
				that.Ajax(p_data);
			} else {
				that.Ajax();
			};
		});
		//多选
		$('.product_brand .multiple_choice').on('click', function() {
			$(this).toggleClass('selected');
		});
	},
	//按功能分
	FunctionList: function() {
		var that = this;
		$.ajax({
			type: "get",
			url: that.url_api3,
			async: true,
			success: function(res) {
				res = JSON.parse(res);
				if(res.code == 200) {
					var fun_arr = res.data.attributes; //功能 数组
					v_function.function_list = fun_arr;
				} else if(res.code == 1) {
					alert('暂无商品')
				} else {
					alert(res);
				};

			},
			error: function(res) {
				alert(res);
			}
		});
		//选择功能
		$(document).on('click', '.product_function li', function() {
			$(this).toggleClass('selected').siblings().removeClass('selected');
			var property_id;
			if($(this).hasClass('selected')){
				property_id = $(this).data('id');
			}
			var p_data = {
				property_id: property_id
			};
			if(property_id){
				that.Ajax(p_data);
			}else{
				that.Ajax();
			}
		});
	},
	//配送地区
	ProductDispatch: function() {
		var that = this;
		$.ajax({
			type: "get",
			url: that.url_api4,
			async: true,
			success: function(res) {
				res = JSON.parse(res);
				console.log('地区res', res)
				if(res.code == 200) {
					var area_arr = res.data.area;
					v_area.product_dispatch = area_arr;
				} else if(res.code == 1) {
					alert('暂无该地区商品')
				} else {
					alert(res)
				}
			},
			error: function(res) {
				alert(res);
			}
		});
		//选择地区渲染商品列表
		$('.js_select_area').on('change', function() {
			var area_val = $(this).val();
			var p_data = {
				area: area_val
			};
			that.Ajax(p_data);
		});

		//包邮
		$('.js_free_shopping').on('change', function() {
			var boolen = $(this).is(':checked');
			var postage = 1; //postage 1表示包邮 num： 1表示有货
			var p_data = {};
			if(boolen == 1) {
				postage = 1;
				p_data = {
					postage: postage
				}
			};
			that.Ajax(p_data);
		});
		//有货商品
		$('.js_available_goods').on('change', function() {
			var boolen = $(this).is(':checked');
			var num = 1; //postage 1表示包邮 num： 1表示有货
			var p_data = {};
			if(boolen == 1) {
				postage = 1;
				p_data = {
					num: num
				}
			};
			that.Ajax(p_data);
		})
	},
	//点击商品跳到商品详情页
	Click_goods: function() {
		$(document).on('click', '.product_list li', function() {
			var goods_id = $(this).data('goodsid');
			window.location.href = 'http://www.ibabypet.com.cn/pcpet/product_detail.html?goodsId=' + goods_id;
		})
	}

}